﻿
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>PackageListDetail</title>

    <link href="~/Assets/component/layui/css/layui.css" rel="stylesheet" />
    <script src="~/Assets/component/layui/layui.js"></script>
    <script src="/Assets/bootstrap/js/jquery-1.10.2.min.js"></script>
</head>
<body>
    <div style="padding: 16px">

        <div class="layui-card" style="height: 800px;">
            <div class="layui-card-body" style="height: max-content;">
              
                <table id="testpade" lay-filter="testpade" class="layui-table"></table>
            </div>

            <form class="layui-form" lay-filter="packageform" action="" style="margin-left: 100px;margin-right: 100px;">

                <input type="hidden" id="hfid" name="id" value="@ViewBag.Id" />
                <div class="layui-form-item" style="display: flex;flex-wrap: wrap;">
                    <label class="layui-form-label">套餐名称</label>
                    <div class="layui-input-inline">
                        <input type="tel" name="PackageName" lay-verify="required" autocomplete="off" class="layui-input" style="height: 30px;">
                    </div>
                    <label class="layui-form-label">套餐价格</label>
                    <div class="layui-input-inline">
                        <input type="tel" name="PackagePrice" lay-verify="required" autocomplete="off" class="layui-input" style="height: 30px;">
                    </div>
                </div>
                <!-- 服务 -->
                <label class="layui-form-label">套餐服务</label>
                <div class="layui-form-item" style="width: 91%; margin-left: 35px;">

                    <table class="layui-table">
                        <thead>
                            <tr>
                                <th><input type="checkbox" id="selectAll" lay-filter="selectAll" class="select-all layui-form-checkbox" /> </th>
                                <th>服务名称</th>
                                <th>服务次数</th>
                                <th>服务价格</th>
                            </tr>
                        </thead>
                        <tbody>
                            @{ int index = 0; }
                            @foreach (var service in ViewBag.Services as List<JinfuyuanProject.Entity.ViewModel. ServicesVM>)
                            {
                                <tr>
                                    <td>
                                        <input type="checkbox"
                                               class="select-item"
                                               lay-filter="selectItem"
                                               lay-skin="primary"
                                               name="services[@index].IsSelected"
                                               @if (service.IsChecked) { <text> checked</text> } />
                                        <input type="hidden"
                                               name="services[@index].ServiceId"
                                               value="@service.Id">
                                    </td>
                                    <td>
                                        <input type="text"
                                               class="layui-input"
                                               value="@service.ServiceName"
                                               name="services[@index].ServiceName">
                                    </td>
                                    <td>
                                        <input type="number"
                                               class="layui-input"
                                               value="@service.ServiceCount"
                                               name="services[@index].ServiceCount">
                                    </td>
                                    <td>
                                        <input type="text"
                                               class="layui-input"
                                               value="@(service.ServicePrice?.ToString("F2") ?? "0.00")"
                                               name="services[@index].ServicePrice"
                                               id="ServicePrice">
                                               
                                    </td>
                                </tr>
                                index++;
                            }
                        </tbody>
                    </table>
                    

                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
            </form>

        </div>

    </div>


    <script>
    
    </script>
    <script>
        function initPackage() {
            let Id = $("#hfid").val()
            $.post("/Package/GetPackageDetail/" + Id, function (resp) {
                if (resp.code == 0) {

                    form.val('packageform', resp.data)

                }

            })
        }
        function submitAdd(data) {
            $.ajax({
                url: "/Package/PackageInsert",
                type: "POST",
                contentType: "application/json",
                data: JSON.stringify(data),
                success: function (resp) {
                    console.log(resp);
                    if (resp.code == 0) {
                        parent.table.reload('testpackage');
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.layer.close(index);
                    }
                }
            });
        }

        function submitUpdate(data) {
            $.ajax({
                url: "/Package/PackageUpdate",
                type: "POST",
                contentType: "application/json",
                data: JSON.stringify(data),
                success: function (resp) {
                    console.log(resp);
                    if (resp.code == 0) {
                        parent.table.reload('testpackage');
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.layer.close(index);
                    }
                }
            });
        }
        var form
        layui.use(['form'], function () {
            initPackage();
            form = layui.form;
            var urlParams = new URLSearchParams(window.location.search); // 获取 URL 参数
            var mode = urlParams.get('mode'); // 获取 'mode' 参数

            if (mode === 'look') {
                // 如果是查看模式，禁用所有表单控件
                form.render('select'); // 刷新 select 元素
                form.render('checkbox'); // 刷新 checkbox 元素
                form.render('radio'); // 刷新 radio 元素

                // 禁用所有表单控件
                $("form :input").each(function () {
                    $(this).attr("disabled", true); // 禁用所有输入控件
                });
                $("form :button").each(function () {
                    $(this).css("display", "none");   // 禁用所有按钮控件
                });
            }
            form.render('select'); // 刷新select选择框渲染
            // 监听全选框的变化
            form.on('checkbox(selectAll)', function (data) {
                var isChecked = data.elem.checked;

                // 设置所有单选框的选中状态
                $('.select-item').each(function () {
                    this.checked = isChecked;
                });

                // 重新渲染表单
                form.render('checkbox');
            });

            // 监听单选框的变化
            form.on('checkbox(selectItem)', function () {
                var allChecked = true;

                // 检查所有单选框是否都被选中
                $('.select-item').each(function () {
                    if (!this.checked) {
                        allChecked = false;
                    }
                });

                // 根据单选框的选中状态来更新全选框
                $('#selectAll')[0].checked = allChecked;

                // 重新渲染表单
                form.render('checkbox');
            });
            // 提交
            form.on('submit(demo1)', function (data) {
               
                // 获取选中服务数据
                var selectedServices = [];
                $('.select-item').each(function (index) {
                    if (this.checked) {
                        selectedServices.push({
                            ServiceId: $(this).closest('tr').find('input[name$=".ServiceId"]').val(),
                            ServiceName: $(this).closest('tr').find('input[name$=".ServiceName"]').val(),
                            ServiceNumber: $(this).closest('tr').find('input[name$=".ServiceCount"]').val(),
                            ServicePrice: $(this).closest('tr').find('input[name$=".ServicePrice"]').val().replace('元', '')
                        });
                    }
                });
                console.log(selectedServices)

                // 构造提交数据
                var postData = {
                    package: data.field,
                    packageServices: selectedServices
                };

                //console.log(postData);

               
                if (data.field.id != 0) {
                    submitUpdate(postData); // 例如，如果有 Id 则更新
                } else {
                    submitAdd(postData); // 否则执行添加操作
                }
                return false;
            });
           
        });
    </script>
</body>
</html>
